<template>
  <div>
    <van-nav-bar
      :title="$store.state.navTitle"
      :left-text="$store.state.isNavBackShow?'返回':''"
      :left-arrow="$store.state.isNavBackShow"
      @click-left="handleNavBack"
      @click-right="handleNavFunc"
      :safe-area-inset-top="true"
    >
      <template #right
        v-if="$store.state.isNavAboutShow"
      >
        <van-icon name="setting-o" size="18" />
      </template>
    </van-nav-bar>
    <router-view></router-view>
  </div>
</template>
<style>
 html,body,#app{
    height: 100%;
    background-color: #f7f8fa;
 }
</style>
<script>
import { onMounted } from '@vue/runtime-core'

import { useRouter } from 'vue-router'
import { useStore } from 'vuex'
export default {

  setup () {
    const router = useRouter()
    const store = useStore()
    const handleNavBack = () => {
      router.back()
    }
    const handleNavFunc = () => {
      router.push('/about')
    }
    onMounted(() => {
      store.commit('setViewHeightNum')
    })
    return {
      handleNavBack,
      handleNavFunc
    }
  }
}

</script>
